<template>
  <div class="balance_invoice">
    <div class="list" v-for="(item, index) in list" :key="index">
      <div class="lis">
        <div class="lis_t">充值金额：￥{{ item.money }}</div>
        <div class="lis_t">充值单号：{{ item.ordersn }}</div>
      </div>
      <div class="btn" @click="catchTap(items, item.id)" v-for="(items, ind) in item.button_models" :key="ind">{{ items.name }}</div>
    </div>
    <invoicePop ref="invoicePop" :balance_invoice="true" @openAddList="invoiceShowAddressFun" @confirm="subInvoice" :addressData="addressData"></invoicePop>
    <!-- 快递地址选择器 -->
    <yz-address-list
      ref="yz_showAddressShop"
      :goodsStyle="false"
      v-model="showAddress"
      :center_path="locations"
      :path_list="delivery_area"
      v-on:confirm="confirmSelectAddress"
      :options="yzAddressListOptions"
    ></yz-address-list>
  </div>
</template>
<script>
import invoicePop from "../../goods/components/invoice-pop.vue";
import yzAddressList from "components/ui_components/yz_addressList/index";

export default {
  props: ["list"],
  data() {
    return {
      rid: "",
      api: "",
      invoice_list: {},
      addressList_caller: "", //地址组件调用着，识别是地址调用还是发票插件调用
      showAddress: false
    };
  },
  methods: {
    // 增加/修改地址
    confirmSelectAddress(item) {
      if (this.addressList_caller == "invoice") {
        this.$refs.invoicePop.setAddress(item);
        this.showAddress = false;
      }
      this.addressData = item;
    },
    //发票插件显示地址
    invoiceShowAddressFun() {
      this.yzAddressListOptions = {
        is_open_store_delivery: this.is_open_store_delivery,
        selected: this.selected
      };
      this.addressList_caller = "invoice";
      this.showAddress = true;
    },
    catchTap(items, rid) {
      this.rid = rid;
      if (items.value == "open") {
        this.openMethods(items);
      } else {
        this.to_detail(rid);
      }
    },
    async to_detail(rid) {
      this.$router.push(this.fun.getUrl("invoiceDetails", { id: rid, tag: "balance_invoice" }));
    },
    async openMethods(items) {
      this.$dialog
        .confirm({ message: `您确定要${items.name}吗?` })
        .then(async () => {
          let { data, msg, result } = await $http.post("plugin.balance-invoice.frontend.invoice-set.index", {}, "");
          if (result) {
            console.log(data);
            this.api = items.api;
            this.$refs.invoicePop.balance_invoice_init(data);
          } else {
            this.rid = "";
            this.$toast(msg);
          }
        })
        .catch(() => {});
    },
    async subInvoice(e) {
      console.log(e, "发票组件回传数据");
      let json = e;
      json.rid = this.rid;
      console.log(json, this.api);
      let { data, msg, result } = await $http.post(this.api, json, "");
      if (result) {
        console.log(data);
        this.$toast(msg);
        this.$emit("update");
      } else {
        this.$toast(msg);
      }
    }
  },
  components: { invoicePop, yzAddressList }
};
</script>
<style lang="scss" scoped>
.list {
  margin: 0.5rem 0.5rem 0 0.5rem;
  padding: 0.75rem;
  box-sizing: border-box;
  background: #fff;
  border-radius: 0.325rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  .btn {
    flex-shrink: 0;
    padding: 0.25rem 0.5rem;
    box-sizing: border-box;
    border: 1px solid #d1d3d7;
    border-radius: 0.75rem;
  }
  .lis {
    font-weight: 500;
    .lis_t {
      line-height: 1.5rem;
    }
  }
}
</style>
